<template>
  <div class="CommonAddBtn" hover-class="hover" hover-start-time="0" hover-stay-time="0" @click="$emit('click')">
    <div class="icon">
      <i class="ali-icon iconfont iconadd"></i>
    </div>
  </div>
</template>

<script>
export default {

}
</script>

<style lang="scss" scoped>
.CommonAddBtn {
	display: flex;
	position: fixed;
	right: 10px;
	bottom: 10px;
	z-index: 1;
	justify-content: center;
	align-items: center;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	box-shadow: 1px 1px 2px 0 rgba(0, 0, 0, .2), -1px -1px 2px 0 rgba(0, 0, 0, .2);
	background: #d1272f;

	&.hover {
		opacity: .8;
	}

	.icon {
		display: flex;
		justify-content: center;
		align-items: center;
		border-radius: 50%;

		.iconfont {
			font-weight: bold;
			font-size: 30px;
			color: #fff;
		}
	}
}
</style>
